<%-- 
    Document   : chart
    Created on : 2016-12-7, 15:40:32
    Author     : 52461
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <link href="${base}/css/bootstrap.css" rel="stylesheet">
        <link href="${base}/css/font-awesome.css" rel="stylesheet">
        <link href="${base}/css/material-kit.css" rel="stylesheet">
        <link rel="stylesheet" href="${base}/css/nprogress.css"/>

        <script type="text/javascript" src="${base}/js/jquery-1.9.1.js"></script>
        <script type="text/javascript" src="${base}/js/bootstrap.min.js"></script>
        <script type="text/javascript" src="${base}/js/material.min.js"></script>
        <script type="text/javascript" src="${base}/js/material-kit.js"></script>
        <script type="text/javascript" src="${base}/js/angular/angular.min.js"></script>
        <script type="text/javascript" src="${base}/js/angular-base.js"></script>
        <script type="text/javascript" src="${base}/js/angular/ui-bootstrap-tpls-0.12.0.min.js"></script>
        <script type="text/javascript" src="${base}/js/jquery.cxhd.js"></script>
        <script type="text/javascript" src="${base}/js/nprogress.js"></script>
        <script type="text/javascript" src="${base}/js/highcharts/highcharts.js" ></script>

    </head>
    <body ng-app="chart" ng-controller="main" style="margin-top: 100px;background: #ffffff">
        <div id="container" style="min-width: 400px; min-height: 400px; max-width: 1000px; margin: 0 auto"></div>
    </body>
</html>
<script>
    angular.module("chart", ["baseModule"])
            .controller("main", function ($scope, base) {
                $scope.data = {};
                $scope.data.pat_id = "<%=request.getAttribute("pat_id")%>".replace("null", "");
                $scope.data.name = "<%=request.getAttribute("name")%>".replace("null", "");
                $scope.data.sex = "<%=request.getAttribute("sex")%>".replace("null", "");
                $scope.data.age = "<%=request.getAttribute("age")%>".replace("null", "");
                $scope.ct_count = 0;
                $scope.dx_count = 0;
                $scope.us_count = 0;
                $scope.mri_count = 0;
                $scope.es_count = 0;
                $scope.bl_count = 0;
                $scope.jy_count = 0;
                $scope.yz_count = 0;

                base.post("getChart", $scope.data).get(function (data) {
                    for (i in data) {
                        console.log(data[i].name == "病历");
                        if (data[i].name == "CT") {
                            $scope.ct_count = data[i].count;
                        } else if (data[i].name == "US") {
                            $scope.us_count = data[i].count;
                        } else if (data[i].name == "DX") {
                            $scope.dx_count = data[i].count;
                        } else if (data[i].name == "MRI") {
                            $scope.mri_count = data[i].count;
                        } else if (data[i].name == "ES") {
                            $scope.es_count = data[i].count;
                        } else if (data[i].name == "病历") {
                            $scope.bl_count = data[i].count;
                            console.log($scope.bl_count);
                        } else if (data[i].name == "检验") {
                            $scope.jy_count = data[i].count;
                        } else if (data[i].name == "医嘱") {
                            $scope.yz_count = data[i].count;
                        }
                    }
                    var datas = [{
                            name: 'CT',
                            y: $scope.ct_count
                        }, {
                            name: 'DX',
                            y: $scope.dx_count

                        }, {
                            name: 'US',
                            y: $scope.us_count
                        }, {
                            name: 'MRI',
                            y: $scope.mri_count
                        }, {
                            name: 'ES',
                            y: $scope.es_count
                        }, {
                            name: "病历",
                            y: $scope.bl_count
                        }, {
                            name: "检验",
                            y: $scope.jy_count
                        }, {
                            name: "医嘱",
                            y: $scope.yz_count
                        }];
                    console.log(datas);
                    Highcharts.chart('container', {
                        chart: {
                            type: 'pie'
                        },
                        plotOptions: {
                            pie: {
                                allowPointSelect: true,
                                cursor: 'pointer',
                                dataLabels: {
                                    enabled: true,
                                    format: '<b>{point.name}</b>: （{point.y}份）{point.percentage:.1f} %',
                                    style: {
                                        color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
                                    }
                                }
                            }
                        },
                        credits: {
                            enabled: false
                        },
                        title: {
                            text: ''
                        },
//                        tooltip: {
//                            pointFormat: '{series.name}: <b>{point.percentage}</b>'
//                        },
                        xAxis: {
                            type: 'category'
                        },
//                        plotOptions: {
//                            pie: {
//                                allowPointSelect: true,
//                                cursor: 'pointer',
//                                dataLabels: {
//                                    enabled: true,
//                                    format: '<b>{point.name}</b>: {point.percentage:.1f} %',
//                                    style: {
//                                        color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
//                                    }
//                                }
//                            }
//                        },
                        series: [{
                                name: $scope.data.name,
                                colorByPoint: true,
                                data: datas
                            }]
                    });
                })


            })


//$(function () {
//    Highcharts.chart('container', {
//        chart: {
//                            type: 'column'
//                        },
//        title: {
//            text: 'Browser market shares January, 2015 to May, 2015'
//        },
//        tooltip: {
//            pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
//        },
//         xAxis: {
//            type: 'category'
//        },
//        plotOptions: {
//            pie: {
//                allowPointSelect: true,
//                cursor: 'pointer',
//                dataLabels: {
//                    enabled: true,
//                    format: '<b>{point.name}</b>: {point.percentage:.1f} %',
//                    style: {
//                        color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
//                    }
//                }
//            }
//        },
//        series: [{
//            name: 'Brands',
//            colorByPoint: true,
//            data: [{
//                name: 'Microsoft Internet Explorer',
//                y: 56.33
//            }, {
//                name: 'Chrome',
//                y: 24.03,
//                sliced: true,
//                selected: true
//            }, {
//                name: 'Firefox',
//                y: 10.38
//            }, {
//                name: 'Safari',
//                y: 4.77
//            }, {
//                name: 'Opera',
//                y: 0.91
//            }, {
//                name: 'Proprietary or Undetectable',
//                y: 0.2
//            }]
//        }]
//    });
//});

</script>
